import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:jiyun_behavior/utils/app_theme.dart';

class GuidanceScreen extends StatefulWidget {
  const GuidanceScreen({Key? key}) : super(key: key);

  @override
  State<GuidanceScreen> createState() => _GuidanceScreenState();
}

class _GuidanceScreenState extends State<GuidanceScreen> {
  final List<bool> _completedTasks = [false, false, true, false];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('修行指引'),
      ),
      body: SafeArea(
        child: SingleChildScrollView(
          child: Padding(
            padding: const EdgeInsets.all(16.0),
            child: Column(
              children: [
                _buildTodayFortune(),
                const SizedBox(height: 20),
                _buildDailyGuidance(),
                const SizedBox(height: 20),
                _buildDosAndDonts(),
                const SizedBox(height: 20),
                _buildLuckyDirections(),
              ],
            ),
          ),
        ),
      ),
    );
  }

  Widget _buildTodayFortune() {
    return Container(
      padding: const EdgeInsets.all(20),
      decoration: BoxDecoration(
        color: AppTheme.secondaryColor,
        borderRadius: BorderRadius.circular(16),
      ),
      child: Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Text(
                '今日运势',
                style: TextStyle(
                  fontSize: 18,
                  fontWeight: FontWeight.bold,
                  color: AppTheme.primaryColor,
                ),
              ),
              Text(
                '2023年6月11日',
                style: TextStyle(
                  fontSize: 14,
                  color: AppTheme.primaryColor,
                ),
              ),
            ],
          ),
          const SizedBox(height: 16),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: [
              _buildFortuneItem('总运', '吉'),
              _buildFortuneItem('财运', '中'),
              _buildFortuneItem('事业', '吉'),
              _buildFortuneItem('健康', '吉'),
            ],
          ),
          const SizedBox(height: 16),
          Text(
            '今日五行缺火，宜穿红色衣物，饮食宜温补，忌生冷食物。事业上有贵人相助，可大胆推进计划。',
            style: TextStyle(
              fontSize: 14,
              color: AppTheme.primaryColor,
              height: 1.6,
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildFortuneItem(String label, String value) {
    return Column(
      children: [
        Text(
          value,
          style: TextStyle(
            fontSize: 24,
            fontWeight: FontWeight.bold,
            color: AppTheme.primaryColor,
          ),
        ),
        const SizedBox(height: 4),
        Text(
          label,
          style: TextStyle(
            fontSize: 12,
            color: AppTheme.primaryColor,
          ),
        ),
      ],
    );
  }

  Widget _buildDailyGuidance() {
    return Card(
      child: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              '今日修行建议',
              style: Theme.of(context).textTheme.titleLarge,
            ),
            const SizedBox(height: 16),
            _buildGuidanceItem(
              icon: FontAwesomeIcons.handsPraying,
              iconColor: AppTheme.primaryColor,
              iconBgColor: AppTheme.secondaryColor,
              title: '晨起诵经',
              description: '清晨起床后，面向东方诵读《太上感应篇》前三章，可增强今日正能量。',
              isCompleted: _completedTasks[0],
              index: 0,
            ),
            const Divider(),
            _buildGuidanceItem(
              icon: FontAwesomeIcons.handHoldingHeart,
              iconColor: const Color(0xFF1890FF),
              iconBgColor: const Color(0xFFE6F7FF),
              title: '行善积德',
              description: '今日宜行一善事，如扶老人过马路、给流浪动物喂食等，可增加福报。',
              isCompleted: _completedTasks[1],
              index: 1,
            ),
            const Divider(),
            _buildGuidanceItem(
              icon: FontAwesomeIcons.seedling,
              iconColor: const Color(0xFF52C41A),
              iconBgColor: const Color(0xFFF6FFED),
              title: '静心冥想',
              description: '午休时间进行15分钟冥想，调整呼吸，放空思绪，可平衡五行能量。',
              isCompleted: _completedTasks[2],
              index: 2,
            ),
            const Divider(),
            _buildGuidanceItem(
              icon: FontAwesomeIcons.moon,
              iconColor: const Color(0xFFFA8C16),
              iconBgColor: const Color(0xFFFFF7E6),
              title: '睡前感恩',
              description: '睡前回顾今日所得，感恩生活中的美好，可增强正能量，促进好梦。',
              isCompleted: _completedTasks[3],
              index: 3,
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildGuidanceItem({
    required IconData icon,
    required Color iconColor,
    required Color iconBgColor,
    required String title,
    required String description,
    required bool isCompleted,
    required int index,
  }) {
    return Padding(
      padding: const EdgeInsets.symmetric(vertical: 8.0),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Container(
            width: 50,
            height: 50,
            decoration: BoxDecoration(
              color: iconBgColor,
              shape: BoxShape.circle,
            ),
            child: Center(
              child: Icon(
                icon,
                color: iconColor,
                size: 20,
              ),
            ),
          ),
          const SizedBox(width: 16),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  title,
                  style: const TextStyle(
                    fontSize: 16,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                const SizedBox(height: 4),
                Text(
                  description,
                  style: TextStyle(
                    fontSize: 14,
                    color: AppTheme.subtitleColor,
                  ),
                ),
              ],
            ),
          ),
          GestureDetector(
            onTap: () {
              setState(() {
                _completedTasks[index] = !_completedTasks[index];
              });
            },
            child: Container(
              width: 24,
              height: 24,
              decoration: BoxDecoration(
                shape: BoxShape.circle,
                border: Border.all(
                  color: isCompleted ? AppTheme.primaryColor : AppTheme.dividerColor,
                  width: 2,
                ),
                color: isCompleted ? AppTheme.primaryColor : Colors.transparent,
              ),
              child: isCompleted
                  ? const Icon(
                      Icons.check,
                      size: 12,
                      color: Colors.white,
                    )
                  : null,
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildDosAndDonts() {
    return Card(
      child: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              '宜忌提示',
              style: Theme.of(context).textTheme.titleLarge,
            ),
            const SizedBox(height: 16),
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  children: [
                    Icon(
                      Icons.check_circle,
                      color: const Color(0xFF52C41A),
                      size: 16,
                    ),
                    const SizedBox(width: 8),
                    Text(
                      '宜',
                      style: TextStyle(
                        fontSize: 16,
                        fontWeight: FontWeight.bold,
                        color: const Color(0xFF52C41A),
                      ),
                    ),
                  ],
                ),
                const SizedBox(height: 8),
                Wrap(
                  spacing: 8,
                  runSpacing: 8,
                  children: [
                    _buildTag('谈生意', const Color(0xFFF6FFED), const Color(0xFF52C41A)),
                    _buildTag('见长辈', const Color(0xFFF6FFED), const Color(0xFF52C41A)),
                    _buildTag('收款', const Color(0xFFF6FFED), const Color(0xFF52C41A)),
                    _buildTag('学习', const Color(0xFFF6FFED), const Color(0xFF52C41A)),
                    _buildTag('锻炼身体', const Color(0xFFF6FFED), const Color(0xFF52C41A)),
                  ],
                ),
              ],
            ),
            const SizedBox(height: 16),
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  children: [
                    Icon(
                      Icons.cancel,
                      color: const Color(0xFFF5222D),
                      size: 16,
                    ),
                    const SizedBox(width: 8),
                    Text(
                      '忌',
                      style: TextStyle(
                        fontSize: 16,
                        fontWeight: FontWeight.bold,
                        color: const Color(0xFFF5222D),
                      ),
                    ),
                  ],
                ),
                const SizedBox(height: 8),
                Wrap(
                  spacing: 8,
                  runSpacing: 8,
                  children: [
                    _buildTag('大额支出', const Color(0xFFFFF1F0), const Color(0xFFF5222D)),
                    _buildTag('争执冲突', const Color(0xFFFFF1F0), const Color(0xFFF5222D)),
                    _buildTag('熬夜', const Color(0xFFFFF1F0), const Color(0xFFF5222D)),
                    _buildTag('搬家', const Color(0xFFFFF1F0), const Color(0xFFF5222D)),
                  ],
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildTag(String text, Color bgColor, Color textColor) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 4),
      decoration: BoxDecoration(
        color: bgColor,
        borderRadius: BorderRadius.circular(16),
      ),
      child: Text(
        text,
        style: TextStyle(
          fontSize: 12,
          color: textColor,
        ),
      ),
    );
  }

  Widget _buildLuckyDirections() {
    return Card(
      child: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              '吉位方向',
              style: Theme.of(context).textTheme.titleLarge,
            ),
            const SizedBox(height: 16),
            SizedBox(
              height: 240,
              child: Stack(
                alignment: Alignment.center,
                children: [
                  Container(
                    width: 240,
                    height: 240,
                    decoration: BoxDecoration(
                      color: const Color(0xFFF5F5F5),
                      shape: BoxShape.circle,
                    ),
                  ),
                  // 中心点
                  Container(
                    width: 60,
                    height: 60,
                    decoration: BoxDecoration(
                      color: Colors.white,
                      shape: BoxShape.circle,
                      boxShadow: [
                        BoxShadow(
                          color: Colors.black.withOpacity(0.1),
                          blurRadius: 4,
                          offset: const Offset(0, 2),
                        ),
                      ],
                    ),
                    child: const Center(
                      child: Icon(
                        Icons.person,
                        size: 24,
                        color: AppTheme.textColor,
                      ),
                    ),
                  ),
                  // 北方
                  Positioned(
                    top: 0,
                    left: 120 - 16,
                    child: Column(
                      children: [
                        const Text(
                          '北',
                          style: TextStyle(
                            fontSize: 14,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                        const SizedBox(height: 4),
                        _buildDirectionArrow(AppTheme.primaryColor, true),
                      ],
                    ),
                  ),
                  // 南方
                  Positioned(
                    bottom: 0,
                    left: 120 - 16,
                    child: Column(
                      children: [
                        _buildDirectionArrow(Colors.grey, false),
                        const SizedBox(height: 4),
                        const Text(
                          '南',
                          style: TextStyle(
                            fontSize: 14,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ],
                    ),
                  ),
                  // 西方
                  Positioned(
                    left: 0,
                    top: 120 - 16,
                    child: Row(
                      children: [
                        const Text(
                          '西',
                          style: TextStyle(
                            fontSize: 14,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                        const SizedBox(width: 4),
                        _buildDirectionArrow(Colors.grey, true, isHorizontal: true),
                      ],
                    ),
                  ),
                  // 东方
                  Positioned(
                    right: 0,
                    top: 120 - 16,
                    child: Row(
                      children: [
                        _buildDirectionArrow(const Color(0xFF52C41A), false, isHorizontal: true),
                        const SizedBox(width: 4),
                        const Text(
                          '东',
                          style: TextStyle(
                            fontSize: 14,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ],
                    ),
                  ),
                  // 西北
                  Positioned(
                    top: 48,
                    left: 48,
                    child: Column(
                      children: [
                        const Text(
                          '西北',
                          style: TextStyle(
                            fontSize: 14,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                        const SizedBox(height: 4),
                        _buildDirectionArrow(Colors.grey, false, isDiagonal: true, angle: 45),
                      ],
                    ),
                  ),
                  // 东北
                  Positioned(
                    top: 48,
                    right: 48,
                    child: Column(
                      children: [
                        const Text(
                          '东北',
                          style: TextStyle(
                            fontSize: 14,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                        const SizedBox(height: 4),
                        _buildDirectionArrow(const Color(0xFF1890FF), true, isDiagonal: true, angle: -45),
                      ],
                    ),
                  ),
                  // 西南
                  Positioned(
                    bottom: 48,
                    left: 48,
                    child: Column(
                      children: [
                        _buildDirectionArrow(Colors.grey, true, isDiagonal: true, angle: -45),
                        const SizedBox(height: 4),
                        const Text(
                          '西南',
                          style: TextStyle(
                            fontSize: 14,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ],
                    ),
                  ),
                  // 东南
                  Positioned(
                    bottom: 48,
                    right: 48,
                    child: Column(
                      children: [
                        _buildDirectionArrow(Colors.grey, false, isDiagonal: true, angle: 45),
                        const SizedBox(height: 4),
                        const Text(
                          '东南',
                          style: TextStyle(
                            fontSize: 14,
                            fontWeight: FontWeight.bold,
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
            const SizedBox(height: 16),
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  children: [
                    Icon(
                      Icons.check_circle,
                      color: const Color(0xFF52C41A),
                      size: 16,
                    ),
                    const SizedBox(width: 8),
                    Text(
                      '吉位',
                      style: TextStyle(
                        fontSize: 16,
                        fontWeight: FontWeight.bold,
                        color: const Color(0xFF52C41A),
                      ),
                    ),
                  ],
                ),
                const SizedBox(height: 8),
                RichText(
                  text: TextSpan(
                    style: TextStyle(
                      fontSize: 14,
                      color: AppTheme.textColor,
                      height: 1.6,
                    ),
                    children: [
                      const TextSpan(text: '今日吉位在'),
                      TextSpan(
                        text: '北方',
                        style: TextStyle(
                          color: AppTheme.primaryColor,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      const TextSpan(text: '和'),
                      TextSpan(
                        text: '东方',
                        style: TextStyle(
                          color: const Color(0xFF52C41A),
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                      const TextSpan(text: '，办公桌朝向这些方向有利于工作顺利，谈判成功。'),
                    ],
                  ),
                ),
              ],
            ),
            const SizedBox(height: 16),
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  children: [
                    Icon(
                      Icons.info,
                      color: const Color(0xFF1890FF),
                      size: 16,
                    ),
                    const SizedBox(width: 8),
                    Text(
                      '开运建议',
                      style: TextStyle(
                        fontSize: 16,
                        fontWeight: FontWeight.bold,
                        color: const Color(0xFF1890FF),
                      ),
                    ),
                  ],
                ),
                const SizedBox(height: 8),
                Text(
                  '今日可在东北方向放置一杯清水，有助于增强智慧和决策力。外出时尽量选择北方或东方道路，有助于遇见贵人。',
                  style: TextStyle(
                    fontSize: 14,
                    color: AppTheme.textColor,
                    height: 1.6,
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildDirectionArrow(Color color, bool isUp, {bool isHorizontal = false, bool isDiagonal = false, double angle = 0}) {
    return Transform.rotate(
      angle: isHorizontal ? (isUp ? 3.14159 : 0) : (isDiagonal ? angle * 3.14159 / 180 : (isUp ? 0 : 3.14159)),
      child: ClipPath(
        clipper: TriangleClipper(),
        child: Container(
          width: 16,
          height: 16,
          color: color,
        ),
      ),
    );
  }
}

class TriangleClipper extends CustomClipper<Path> {
  @override
  Path getClip(Size size) {
    final path = Path();
    path.moveTo(size.width / 2, 0);
    path.lineTo(size.width, size.height);
    path.lineTo(0, size.height);
    path.close();
    return path;
  }

  @override
  bool shouldReclip(covariant CustomClipper<Path> oldClipper) {
    return false;
  }
} 